import React, { Component } from 'react';
import "./recommend.css"
import request from "../../api"
import { NavLink, Link, withRouter } from "react-router-dom"

interface Props {
    history: any,
    location: any,
    match: any
}
interface State {
    recommendlist: RedItem[]
}
interface RedItem {
    img1: string,
    proname: string,
    originprice: number,
    proid: string

}
class Recommend extends Component<Props, State> {
    constructor(props: Props) {
        super(props);
        this.state = {
            recommendlist: []
        }
    }
    componentDidMount(): void {
        request.mypro.pro_recommendlist().then((ok) => {
            this.setState({ recommendlist: ok.data.data }, () => {
                console.log(this.state.recommendlist, "推荐列表");

            })
        }).catch(() => { })
    }
    //跳转到商品详情
    todetail(proid: string) {
        // this.props.history.push({ pathname:'/detail',query:{ proid:proid } });

        if (this.props.match.path == '/detail/:proid') {
           
            this.props.history.push('/detail/' + proid)
            this.props.history.go(0)

        } else {
            this.props.history.push('/detail/' + proid)
        }

    }
    render() {
        return (
            <div className='recommed'>
                {
                    this.state.recommendlist.map((item, index) => {
                        return (
                            <div className='redlist' key={index} onClick={() => { this.todetail(item.proid) }}>
                                <img src={item.img1} alt="" />
                                <div className='itemtext'> {item.proname}</div>
                                <div className='itempic'> ¥{item.originprice}</div>
                            </div>
                        )
                    })
                }
            </div>
        );
    }
}

export default withRouter(Recommend);